﻿@model PersonSearchModel
<!DOCTYPE html>
<html>
<head>
    <title>Person Search</title>
    <style>
        table{border-collapse:collapse;}table,td,th{border:1px #000 solid;}
        ul{list-style-type:none;padding:0;margin:0;}li{float:left;padding-right:3px;}
    </style>
</head>
<body>
@Ajax.RefreshPanel("search", "name",
    @<div>
        @using (Html.BeginRefreshForm(null, true, __razor_template_writer))
        {
             @Html.LabelFor(m => m.Name)
             @Html.TextBoxFor(m => m.Name)
             <input type="submit" name="search" value="Search" />
        }
    </div>)
    Page size
    @Html.RefreshLink("5", new NavigationData() { { "startRowIndex", "" }, { "maximumRows", 5 } }, true)
    @Html.RefreshLink("10", new NavigationData() { { "startRowIndex", "" }, { "maximumRows", "" } }, true)
@Ajax.RefreshPanel("list", "sortExpression,startRowIndex,maximumRows,name",
    @<div>
        <table>
            <thead>
                <tr>
                    <th>@Html.Sorter("Name", "Name")</th>
                    <th>Date of Birth</th>
                </tr>
            </thead>
            <tbody>
                @foreach (var person in Model.People)
                {
                    <tr>
                        <td>
                            @Html.NavigationLink(person.Name, "Select", new NavigationData { { "id", person.Id } })
                        </td>
                        <td>@person.DateOfBirth.ToShortDateString()</td>
                    </tr>
                }
            </tbody>
        </table>
    </div>)
@Ajax.RefreshPanel("pager", "startRowIndex,maximumRows,name",
    @<div>
        @Html.Pager("First", "Previous", "Next", "Last")
        @string.Format("Total Count {0}", StateContext.Bag.totalRowCount)
    </div>)
    <script src="~/Scripts/navigation.mvc.js"></script>
</body>
</html>
